﻿@model OT.Areas.Admin.Models.Questions
<div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><i class="fa fa-times"></i></button>
    <h3 id="myModalLabel">Edit Question</h3>
</div>
@Html.HiddenFor(model => model.QuestionID, new { id = "HDFID" })
<div class="modal-body" style="height: 600px">
    <div id="alert_modal">
        @Html.ValidationSummary()
    </div>
    <div class="form-horizontal" role="form">
        <div class="form-group">
            <div class="col-lg-13">
                <div id="divMsgEdit"></div>
            </div>
        </div>
        <div class="form-group" id="divCategory">
            <label class="col-lg-3 control-label">Category</label>
            <div class="col-lg-5">
                @Html.DropDownListFor(model => model.CategoryID, new SelectList(Model.catgo, "CategoryID", "CategoryName"), "--- Select ---", new { @class = "form-control" })
                @Html.ValidationMessageFor(model => model.CategoryID)
            </div>
        </div>
        <div class="form-group" id="divSubject">
            <label class="col-lg-3 control-label">Subject</label>
            <div class="col-lg-5">
                @Html.DropDownListFor(model => model.SubjectID, new SelectList(Model.Subjects, "SubjectID", "SubjectName"), "--- Select ---", new { @class = "form-control" })
                @Html.ValidationMessageFor(model => model.SubjectID)
            </div>
        </div>
        <div class="form-group" id="divTopic">
            <label class="col-lg-3 control-label">Topic Name</label>
            <div class="col-lg-5">
                @Html.DropDownListFor(model => model.TopicID, new SelectList(Model.Topics, "TopicID", "TopicName"), "--- Select ---", new { @class = "form-control" })
                @Html.ValidationMessageFor(model => model.TopicID)
            </div>
        </div>
        <div class="form-group" id="divQuestionType">
            <label class="col-lg-3 control-label">Question Type</label>
            <div class="col-lg-5">
                @Html.DropDownListFor(model => model.QuestionTypeID, new SelectList(Model.QuestionTypes, "QuestionTypeID", "QuestionType1"), "---select---", new { @class = "form-control" })
                @Html.ValidationMessageFor(model => model.QuestionTypeID)
            </div>
        </div>
        <div class="form-group" id="divQuestionName">
            <label class="col-lg-3 control-label">Question Name</label>
            <div class="col-lg-5">
                <textarea class="form-control" placeholder="Enter Question Name" id="QuestionName" rows="1" maxlength="250">@Model.QuestionName</textarea>
            </div>
        </div>
        <div class="form-group" id="divDispalyAnswer">
            @{
                List<SelectListItem> listItems = new List<SelectListItem>();
                listItems.Add(new SelectListItem
                 {
                     Text = "4",
                     Value = "4"
                 });
                listItems.Add(new SelectListItem
                {
                    Text = "3",
                    Value = "3",
                    Selected = true
                });
                listItems.Add(new SelectListItem
                {
                    Text = "2",
                    Value = "2"
                });
            }
            <label class="col-lg-3 control-label">Display Answer</label>
            <div class="col-lg-5">
                @Html.DropDownListFor(model => model.DisplayAnswer, listItems, new { @class = "form-control" })
                @Html.ValidationMessageFor(model => model.DisplayAnswer)
            </div>
        </div>
    </div>
    <div class="clearfix"></div>
    <div class="form-vertical" role="form">
        <div class="form-group">
            <div class="col-lg-3"></div>
        </div>
        <div class="form-group" id="divAns1">
            <div class="col-lg-4" id="ans1">
                <textarea class="form-control" placeholder="Enter Answer 1" id="Answer1" rows="2" maxlength="50">@Model.Answer1</textarea>
            </div>
        </div>
        <div class="form-group" id="divAns2">
            <div class="col-lg-4" id="ans2">
                <textarea class="form-control" placeholder="Enter Answer 2" id="Answer2" rows="2" maxlength="50">@Model.Answer2</textarea>
            </div>
        </div>
        <div class="clearfix"></div>
    </div>
    <div class="form-vertical" role="form">
        <div class="form-group">
            <div class="col-lg-3"></div>
        </div>
        <div class="form-group" id="divAns3">
            <div class="col-lg-4" id="ans3">
                <textarea class="form-control" placeholder="Enter Answer 3" id="Answer3" rows="2" maxlength="50">@Model.Answer3</textarea>
            </div>
        </div>
        <div class="form-group" id="divAns4">
            <div class="col-lg-4" id="ans4">
                <textarea class="form-control" placeholder="Enter answer 4" id="Answer4" rows="2" maxlength="50">@Model.Answer4</textarea>
            </div>
        </div>
    </div>
    <div class="clearfix"></div>
    <br />
    <div class="form-horizontal" role="form">
        <div class="form-group" id="divCorrectAnswer">
            <label class="col-lg-3 control-label">Correct Answer</label>
            <div class="col-lg-4">
                @Html.DropDownListFor(model => model.CorrectAnswer, listItems, new { @class = "form-control" })
                @Html.ValidationMessageFor(model => model.CorrectAnswer)
            </div>
        </div>
      @*  <div class="form-group" id="divUser">
            <label class="col-lg-3 control-label">User</label>
            <div class="col-lg-4">
                @Html.DropDownListFor(model => model.UserID, new SelectList(Model.Users, "UserID", "FirstName"), "--select--", new { @class = "form-control" })
                @Html.ValidationMessageFor(model => model.UserID)
            </div>
        </div>*@
    </div>
    <div class="form-vertical" role="form">
        <div class="form-group">
            <div class="col-lg-3"></div>
        </div>
        <div class="form-group">
            
            <div class="col-lg-1">
                @Html.EditorFor(model => model.UseLatex)
                @Html.ValidationMessageFor(model => model.UseLatex)
            </div>
            <label class="col-lg-1 control-label">Latex</label>
        </div>
        <div class="form-group">
           
            <div class="col-lg-1">
                @Html.EditorFor(model => model.Status)
            </div>
             <label class="col-lg-1 control-label">Status</label>
        </div>
    </div>
    <br />
</div>
<div class="clearfix"></div>
<div class="modal-footer">
    <button class="btn btn-default" type="submit" id="btnEdit"><i class="icon-cog"></i>Save</button>
    <button class="btn btn-default" data-dismiss="modal" aria-hidden="true"><i class="icon-off"></i>Cancel</button>
</div>
<script type="text/javascript">
    $(document).ready(function () {
        var dispans = $('#DisplayAnswer').val();
        var select = $("#CorrectAnswer");
        var CorrectAns = @Model.CorrectAnswer
        select.empty();
        for (i = 1; i <= dispans; i++) {
            select.append($('<option/>', {
                value: i,
                text: i
            }));
        }
        $("#CorrectAnswer").val(CorrectAns);
        selectedAns(dispans);
    });
    $("#btnEdit").click(function (e) {
        var QuestionID = $("#HDFID").val();
        var QuestionName = $("#QuestionName").val();
        var QuestionTypeID = $("#QuestionTypeID").val();
        var TopicID = $("#TopicID").val();
        var SubjectID = $("#SubjectID").val();
        var Answer1 = $("#Answer1").val();
        var Answer2 = $("#Answer2").val();
        var Answer3 = $("#Answer3").val();
        var Answer4 = $("#Answer4").val();
        var DisplayAnswer = $("#DisplayAnswer").val();
        var CorrectAnswer = $("#CorrectAnswer").val();
        var Category = $("#CategoryID").val();
        var User = 0;
        if ($("#Status").is(':checked')) {
            Status = true;
        }
        else {
            Status = false;
        }
        var UseLatex = $("#UseLatex").val();
        e.preventDefault();
        function call() {
            $.ajax({
                url: "/Admin/Question/Edit?QuestionID=" + QuestionID + "&QuestionName=" + QuestionName + "&QuestionTypeID=" + QuestionTypeID + "&TopicID=" + TopicID + "&SubjectID=" + SubjectID + "&Answer1=" + Answer1 + "&Answer2=" + Answer2 + "&Answer3=" + Answer3 + "&Answer4=" + Answer4 + "&DisplayAnswer=" + DisplayAnswer + "&CorrectAnswer=" + CorrectAnswer + "&Status=" + Status + "&UseLatex=" + UseLatex,
                type: "POST",
                success: function (result) {
                    if (result != "NotValid") {
                        $('#modalDiv').modal('hide');
                        showMsg('divMsgIndex', 'Record Updated Successfuly', 'success');
                        loadPage(1, 10, '');
                    }
                    else {
                        showMsg('divMsgEdit', 'Failed To Update Record', 'danger');
                    }
                },
                error: function (data) {
                }
            });
        }
        switch (DisplayAnswer) {
            case '4':
                if (QuestionName == '' || QuestionTypeID == 0 || TopicID == 0 || SubjectID == 0 || CorrectAnswer == 0 || CategoryID == 0 || Answer1 == '' || Answer2 == '' || Answer3 == '' || Answer4 == '' ) {
                    showMsg('divMsgEdit', 'Please Enter Value in Required Field', 'danger');
                    (QuestionName == '') ? $('#divQuestionName').addClass('has-error') : $('#divQuestionName').removeClass('has-error');
                    (QuestionTypeID == 0) ? $('#divQuestionType').addClass('has-error') : $('#divQuestionType').removeClass('has-error');
                    (TopicID == 0) ? $('#divTopic').addClass('has-error') : $('#divTopic').removeClass('has-error');
                    (SubjectID == 0) ? $('#divSubject').addClass('has-error') : $('#divSubject').removeClass('has-error');
                    (CorrectAnswer == 0) ? $('#divCorrectAnswer').addClass('has-error') : $('#divCorrectAnswer').removeClass('has-error');
                    (CategoryID == 0) ? $('#divCategory').addClass('has-error') : $('#divCategory').removeClass('has-error');
                    (Answer4 == '') ? $('#divAns4').addClass('has-error') : $('#divAns4').removeClass('has-error');
                    (Answer3 == '') ? $('#divAns3').addClass('has-error') : $('#divAns3').removeClass('has-error');
                    (Answer2 == '') ? $('#divAns2').addClass('has-error') : $('#divAns2').removeClass('has-error');
                    (Answer1 == '') ? $('#divAns1').addClass('has-error') : $('#divAns1').removeClass('has-error');
                    //(User == '') ? $('#divUser').addClass('has-error') : $('#divUser').removeClass('has-error');
                }
                else {
                    call();
                }
                break;
            case '3':
                if (QuestionName == '' || QuestionTypeID == 0 || TopicID == 0 || SubjectID == 0 || CorrectAnswer == 0 || CategoryID == 0 || Answer1 == '' || Answer2 == '' || Answer3 == '' ) {
                    showMsg('divMsgEdit', 'Please Enter Value in Required Field', 'danger');
                    (QuestionName == '') ? $('#divQuestionName').addClass('has-error') : $('#divQuestionName').removeClass('has-error');
                    (QuestionTypeID == 0) ? $('#divQuestionType').addClass('has-error') : $('#divQuestionType').removeClass('has-error');
                    (TopicID == 0) ? $('#divTopic').addClass('has-error') : $('#divTopic').removeClass('has-error');
                    (SubjectID == 0) ? $('#divSubject').addClass('has-error') : $('#divSubject').removeClass('has-error');
                    (CorrectAnswer == 0) ? $('#divCorrectAnswer').addClass('has-error') : $('#divCorrectAnswer').removeClass('has-error');
                    (CategoryID == 0) ? $('#divCategory').addClass('has-error') : $('#divCategory').removeClass('has-error');
                    (Answer3 == '') ? $('#divAns3').addClass('has-error') : $('#divAns3').removeClass('has-error');
                    (Answer2 == '') ? $('#divAns2').addClass('has-error') : $('#divAns2').removeClass('has-error');
                    (Answer1 == '') ? $('#divAns1').addClass('has-error') : $('#divAns1').removeClass('has-error');
                    //(User == '') ? $('#divUser').addClass('has-error') : $('#divUser').removeClass('has-error');
                }
                else {
                    call();
                }
                break;
            case '2':
                if (QuestionName == '' || QuestionTypeID == 0 || TopicID == 0 || SubjectID == 0 || CorrectAnswer == 0 || CategoryID == 0 || Answer1 == '' || Answer2 == '') {
                    showMsg('divMsgEdit', 'Please Enter Value in Required Field', 'danger');
                    (QuestionName == '') ? $('#divQuestionName').addClass('has-error') : $('#divQuestionName').removeClass('has-error');
                    (QuestionTypeID == 0) ? $('#divQuestionType').addClass('has-error') : $('#divQuestionType').removeClass('has-error');
                    (TopicID == 0) ? $('#divTopic').addClass('has-error') : $('#divTopic').removeClass('has-error');
                    (SubjectID == 0) ? $('#divSubject').addClass('has-error') : $('#divSubject').removeClass('has-error');
                    (CorrectAnswer == 0) ? $('#divCorrectAnswer').addClass('has-error') : $('#divCorrectAnswer').removeClass('has-error');
                    (CategoryID == 0) ? $('#divCategory').addClass('has-error') : $('#divCategory').removeClass('has-error');
                    (Answer2 == '') ? $('#divAns2').addClass('has-error') : $('#divAns2').removeClass('has-error');
                    (Answer1 == '') ? $('#divAns1').addClass('has-error') : $('#divAns1').removeClass('has-error');
                    //(User == '') ? $('#divUser').addClass('has-error') : $('#divUser').removeClass('has-error');
                }
                else {
                    call();
                }
                break;
            default:
                break;
        }
        return false;
    });

    $("#CategoryID").change(function (e) {
        var CategoryID = $(this).val();
        var sub = $("#SubjectID").empty();
        if (CategoryID > 0) {
            $.getJSON("/Admin/Question/LoadSubject", { CategoryID: CategoryID },
                   function (classesData) {
                       var select = $("#SubjectID");
                       select.empty();
                       select.append($('<option/>', {
                           value: 0,
                           text: "----Select Subject----"
                       }));
                       $.each(classesData, function (index, itemData) {

                           select.append($('<option/>', {
                               value: itemData.Value,
                               text: itemData.Text
                           }));
                       });
                   });
        }
        else {
            var select = $("#SubjectID");
            select.empty();
            select.append($('<option/>', {
                value: 0,
                text: "----Select Subject----"
            }));
        }
        return false;
    });

    $("#SubjectID").change(function (e) {
        var SubjectID = $(this).val();
        var sub = $("#TopicID").empty();
        if (SubjectID > 0) {
            $.getJSON("/Admin/Question/LoadTopic", { SubjectID: SubjectID },
                   function (classesData) {
                       var select = $("#TopicID");
                       select.append($('<option/>', {
                           value: 0,
                           text: "----Select Topic----"
                       }));
                       $.each(classesData, function (index, itemData) {
                           select.append($('<option/>', {
                               value: itemData.Value,
                               text: itemData.Text
                           }));
                       });
                   });
        }
        return false;
    });

    $("#DisplayAnswer").change(function (e) {
        var DisplayAnswer = $(this).val();
        var select = $("#CorrectAnswer");
        select.empty();
        for (i = 1; i <= DisplayAnswer; i++) {
            select.append($('<option/>', {
                value: i,
                text: i
            }));
        }
        selectedAns(DisplayAnswer);
        return false;
    });
    function selectedAns(DisplayAnswer) {
        if (DisplayAnswer == 4) {
            $("#ans1").css({ "display": "initial" });
            $("#ans2").css({ "display": "initial" });
            $("#ans3").css({ "display": "initial" });
            $("#ans4").css({ "display": "initial" });
        }
        else if (DisplayAnswer == 3) {
            $("#ans1").css({ "display": "initial" });
            $("#ans2").css({ "display": "initial" });
            $("#ans3").css({ "display": "initial" });
            $("#ans4").css({ "display": "none" });
        }
        else if (DisplayAnswer == 2) {
            $("#ans1").css({ "display": "initial" });
            $("#ans2").css({ "display": "initial" });
            $("#ans3").css({ "display": "none" });
            $("#ans4").css({ "display": "none" });
        }
        if (DisplayAnswer == 0) {
            $("#ans1").css({ "display": "none" });
            $("#ans2").css({ "display": "none" });
            $("#ans3").css({ "display": "none" });
            $("#ans4").css({ "display": "none" });
        }
    }
</script>
